import React, { Component } from 'react';
import { Grid, Dialog, Feedback } from '@icedesign/base';
import axios from 'axios';
import './NewsList.scss';
// import { GetUrlParam } from '../../baseConfig';

const { Row, Col } = Grid;
const Toast = Feedback.toast;

export default class NewsList extends Component {
  static displayName = 'NewsList';

  constructor(props) {
    super(props);
    // console.log("NewsList",props)
    this.state = {
      ThisURL:this.props.dataURL,
      dataSource:[],

      content:'',
      contentShow:false,
      align: "cc cc",
      style:{
        width:"80%",
        height:"80%",
      },
      CTitle:'',
      CDesc:'',
      CDates:'',
      CWebpageUrl:'',
      CKeyword:'',
      COrigin:'',

      ControlShow:false,
      ControlContent:[],
    };
  }

  static defaultProps = {
    // dataSource: [],
  };

  getData(URL){
    // console.log("URL",URL)
    axios.get(URL)
    .then((response) => {
      // console.log("response",response.data.data)
      this.setState({
        dataSource:response.data.data.data_list
      })
    })
    .catch(function (error) {
      console.log(error);
    });
  }

  componentDidMount(){
    // console.log("leftURL",this.props.dataURL)
    this.getData(this.props.dataURL);
  }

  // componentWillReceiveProps(){
  //   this.getData(this.props.dataURL);
  // }

  onClose = () => {
    this.setState({
      contentShow: false,
      content:''
    });
  };

  GetUrlParam(paraName)  {
  　var url = document.location.toString();
      // console.log("url",url)
  　var arrObj = url.split("?");
　　　if (arrObj.length > 1) {
　　　　　var arrPara = arrObj[1].split("&");
　　　　　var arr;
　　　　　for (var i = 0; i < arrPara.length; i++) {
　　　　　　　arr = arrPara[i].split("=");
　　　　　　　if (arr != null && arr[0] == paraName) {
　　　　　　　　　return arr[1];
　　　　　　　}
　　　　　}
　　　　　return "";
　　　}
　　　else { return ""; }
  }

  onOpen = (ids) => {
    // let url = 'https://gdpage.cfbond.com/gdH5/#/'
    // window.location.href = url.split('/#/')[0]+`/#/detail?secu_code=${this.GetUrlParam('secu_code')}&id=${ids}&type=opinion`
    // window.open(url.split('/#/')[0]+`/#/detail?secu_code=${this.GetUrlParam('secu_code')}&id=${ids}&type=opinion`)
    // window.open(window.location.href.split('/#/')[0]+`/#/detail?secu_code=${this.GetUrlString('secu_code')}&id=${ids}`)
    axios({
      url: `${global.constants.GOLDEYEGETHOST}cattle/get_all_detail`,
      method: 'get',
      params: {
        type: 'opinion',
        secu_code:GetUrlParam("secu_code"),
        id:ids
      }
    }).then(response => {
      console.log("详情页内容",response.data.data)
      if(response.data.flag){
        this.setState({
          // allselect:true,
          CTitle:response.data.data.title,
          CDesc:response.data.data.content,
          CDates:response.data.data.publishedMinute,
          CKeyword:response.data.data.keyword,
          COrigin:response.data.data.originTypeName,
          CWebpageUrl:response.data.data.webpageUrl
        })
        let c = []
        c.push(
          <div key={ids}>
            <p className="content-title" dangerouslySetInnerHTML={{__html:this.state.CTitle}}></p>
            <div className="dee-box">
              <span className="dee-st">来源：{this.state.COrigin}</span><span style={{ marginRight:'10px'}}>|</span><span className="dee-st">颁发时间：{this.state.CDates}</span>
              {/* <span className="dee-st">涉及关键词：<span style={{color:'#cc0000'}}>{this.state.CKeyword}</span></span> */}
              {/* <a href={this.state.CWebpageUrl} target="_blank"><span className="cky">查看原文</span></a> */}
            </div>
            <div className="content-desc">
              <p className="desc-lineHeight" dangerouslySetInnerHTML={{__html:this.state.CDesc}}></p>
            </div>
          </div>
        );
        this.setState({
          contentShow: true,
          content:c
        });
      }else{
        Toast.show({
          // content:'详情页出错，请重试',
          content: response.data.msg,
          afterClose: () => console.log("")
        })
      }
      
    }).catch(error => {
      console.log(error);
    });
    
  };

  render() {
    // const { dataSource } = this.props;
    //showTooltip={true}
    const footer = (
      <a onClick={this.onClose} href="javascript:;">
      </a>
    );

    return (
      <div className="new-box">
        <Dialog
            visible={this.state.contentShow}
            shouldUpdatePosition
            onClose={this.onClose}
            isFullScreen={false}
            style={this.state.style}
            align={this.state.align}
            footer={footer}
            closable
          >
            {this.state.content}
        </Dialog>
        {this.state.dataSource.map((item,i) => {
          return(
            // <Link key={i} to={{pathname:"/ContentPage", query:{ids:item.id}, state:{id:item.id, history:document.location.toString()}}}>
            <div className="list-box" key={i}>
              <div onClick={this.onOpen.bind(this,item.id)}>
              <span className="News-title" dangerouslySetInnerHTML={{__html:item.title}}></span>
                <div className="info-box">
                  <Col s="24" xxs="24"><div className="left-infoCol"><span style={{marginRight:'10px'}}>{item.captureWebsiteName}</span> | <span style={{marginLeft:'10px'}}>{item.publishedMinute}</span></div></Col>
                  {/* <Col s="8" xxs="24"><div className="right-infoCol"></div></Col> */}
                </div>
              </div>
            </div>
            // </Link>
          );
        })
        }
      </div>
    );
  }
}

